<template>
  <div class="image-upload-box" @click="$refs.uploadInput.click()">
    <i class="el-icon-plus image-upload-icon" />
    <input ref="uploadInput" type="file" class="image-upload-input">
  </div>
</template>

<style lang="scss" scoped>
.image-upload-box {
  width: 180px;
  height: 180px;
  border: 1px dashed #d9d9d9;
  border-radius: 5px;

  display: flex;
  align-items: center;
  justify-content: center;

  // &就是当前选择器
  &:hover{
    border: 1px dashed #8df;
  }

  .image-upload-icon{
    font-size: 40px;
    color: #d9d9d9;
  }

  .image-upload-input{
    display: none;
    z-index: -999999;
  }
}
// .image-upload-box:hover{
//   border: 1px dashed #8df;
// }
</style>
